<template>
  <view class="whole">
    <switcher-view
      :pages="['动态管理', '博客草稿管理', '发布博客管理']"
      @changeIndex="getIndex"
    ></switcher-view>

 <view
    class="content"
  >
        <view v-if="currentIndex == 0" class="dynamic-container">
            <!-- 动态管理页面 -->
			<view class="null" v-if="liveList.length==0">
				暂无数据
			</view>
            <view
                v-for="(item, index) in liveList"
                :key="item.postId"
                class="swipe-action-item"
            >
                <!-- 删除操作 -->
                <view
                    class="dynamic-item"
                    @click="goToLiveDisplay(uid, item.postId)" 
                >
                    <view class="dynamic-images">
                        <image
                            v-for="(img, idx) in item.imgs"
                            :key="idx"
                            :src="img"
                            class="dynamic-image"
                            mode="aspectFill"
                        />
                    </view>
                    <view class="dynamic-content">
                        <text class="dynamic-text">内容：{{ item.content }}</text>
                        <view class="likes-buttons-container">
                            <text class="likes">点赞数：{{ item.likesCount }}</text>
                            <view class="delete-btn" @click.stop="deletePost(index, item.postId)">
                                删除
                            </view>
                        </view>
                        <text class="time">发布时间：{{ formatTime(item.createdAt) }}</text>
                    </view>
                </view>
            </view>
        </view>

	   
	   <view v-if="currentIndex ===1" >
		   <dynamic-list-xhd
		   class="list"
		   :itemList="managementDrafts"
		   :viewHeight="viewHeight"
		   :itemHeight="120"
		   :loadCount="loadCount" 
		   :fetchData="fetchDraftsData"
		   :needRefresh="true"
		   :startRefreshOnce="fetchDraftsOnce"
		   >
		   <template v-slot:item="{ item }" >
		   	<view class="draftShow" @click="goWriteDraft(item)">
		   		<view class="draftText">
		   			<view class="text" :class="{ fullWidth: !item.cover }">
		   				<!-- 相关博客标题和简介 -->
		   				<view class="draftTitle">{{ item.title }}</view>
		   				<view class="draftIntroduce">{{item.desc }}</view>
		   			</view>
		   			<!-- 相关博客图片 -->
		   			<view class="picture" v-if="item.cover" :style="{ backgroundImage: 'url(' + item.cover + ')' }"></view>
		   		</view>
		   		<view class="otherDraftMsg">
		   		<view class="draftMsg">
		   			<view class="text">草稿</view>
		   			<view class="type">{{ item.type }}</view>
		   			<view class="lastUpdateTime">{{ item.updateTime }} </view>
		   		</view>
		   		   <image class="iconfont icon-weibiaoti5 icon" @click.stop="selectDraft(item)"></image>
		   		</view>
		   	</view>
		   </template>
		   </dynamic-list-xhd>
	   </view>
	   <view v-if="currentIndex ===2">
			<dynamic-list-xhd
			class="list"
			:itemList="managementBlogs"
			:viewHeight="viewHeight"
			:itemHeight="120"
			:loadCount="loadCount" 
			:fetchData="fetchManagementBlogs"
			:needRefresh="true"
			:startRefreshOnce="fetchManagementBlogsOnce"
			>
			<template v-slot:item="{ item }" >
				<view class="blogShow" @click="goDisplyBlog(item)">
					<view class="blogText">
						<view class="text" :class="{ fullWidth: !item.pictureImg }">
							<!-- 相关博客标题和简介 -->
							<view class="blogTitle">{{ item.postTitle }}</view>
							<view class="blogIntroduce">{{item.postIntroduce }}</view>
						</view>
						<!-- 相关博客图片 -->
						<view class="picture" v-if="item.pictureImg  " :style="{ backgroundImage: 'url(' + item.pictureImg + ')' }"></view>
					</view>
					<view class="otherBlogMsg">
					<view class="blogMsg">
						<view class="username">{{ item.likeCount }} 点赞</view>
						<view class="read">{{ item.viewCount }} 阅读</view>
						<view class="commentCount">{{ item.commentCount }} 评论</view>
						<view class="collectCount">{{ item.collectCount }} 收藏</view>
					</view>
					   <image class="iconfont icon-weibiaoti5 icon" @click.stop="selectBlog(item)"></image>
					</view>
				</view>
			</template>
			</dynamic-list-xhd>
	      </view>
	    </view>
		
		<!--删除草稿-->
		<view  :class="['delete-draft-modal', { 'slide-in': isShowDeleteDraftModal, 'slide-out': ! isShowDeleteDraftModal }]" @click="isShowDeleteDraftModal=false">
			<view class="delete-draft-modal-content" @click.stop >
				 <!-- 第一行：移动收藏夹 -->
				    <view class="modal-item" @click="delectedDraft">
				     <image class="iconfont icon-shanchu icon" ></image>
				      <text class="text">删除草稿</text>
				    </view>
				    
				    <!-- 第二行：删除收藏 -->
				    <view class="modal-item" @click="isShowDeleteDraftModal=false">
				      <image class="iconfont icon-cuowu icon" ></image>
				      <text class="text">取消</text>
				    </view>
			</view>
		</view>
		<!--删除博客-->
		<view  :class="['delete-blog-modal', { 'slide-in': isShowDeleteBlogModal, 'slide-out': ! isShowDeleteBlogModal }]" @click="isShowDeleteBlogModal=false">
			<view class="delete-blog-modal-content" @click.stop >
				 <!-- 第一行：移动收藏夹 -->
				    <view class="modal-item" @click="delectedBlog">
				     <image class="iconfont icon-shanchu icon" ></image>
				      <text class="text">删除博客</text>
				    </view>
				    <view class="modal-item" @click="editBlog">
				     <image class="iconfont icon-shanchu icon" ></image>
				      <text class="text">编辑博客</text>
				    </view>
				    <!-- 第二行：删除收藏 -->
				    <view class="modal-item" @click="cancel">
				      <image class="iconfont icon-cuowu icon" ></image>
				      <text class="text">取消</text>
				    </view>
			</view>
		</view>

	
  </view>
</template>

<script>
  import SwitcherView from "@/components/switcher-view/switcher-view.vue";
  import method from "@/utils/methods.js";
  import request from "../../utils/request.js";
  import file from "../../utils/file.js";

  export default {
    components: { SwitcherView},
    data() {
      return {
        currentIndex: 0,
        uid: null,
        token: null,
        liveCurrentPage: 0,
        livePageSize: 20,
		isLiveReady:false,//动态数据是否加载完毕
        liveList: [],
		managementBlogs:[],
		viewHeight:0,
		loadCount:10,
		managementBlogsOffset:0,
		fetchManagementBlogsOnce:true,
		selectedBlog:undefined,
		isShowDeleteBlogModal:false,
		//草稿
		fetchDraftsOnce:true,
		draftOffset:0,
		managementDrafts:[],
		selectedDraft:undefined,
		isShowDeleteDraftModal:false,
		
      };
    },
    onLoad() {
      this.initData();
      this.getMyLive();
	  this.calculateViewHeight();
    },
	watch: {
	},
    methods: {
		
	async handleDraftCover(draftId) {
	    if (draftId) {
	        // 根据 blogId 构造封面图片的 URL
	        let url = this.baseUrl + "/file/" +draftId + "?type=tempPostCover";
	        
	        try {
	            // 发送请求获取封面图片
	            let result = await request.sendUniGetRequestByNetWork(this.uid,this.token, url);
	
	            if (result && result.code === 1 && result.data) {
	                let coverImageResult = result.data;
	                if (coverImageResult && coverImageResult.imgType && coverImageResult.fileContent) {
	                    // 成功获取封面图片，生成图片 URL
	                    return file.generateImagUrl(coverImageResult.fileContent, coverImageResult.imgType);
	                }
	            }
	        } catch (error) {
	            console.error("获取封面图片失败", error);
	        }
	    }
	
	    // 如果没有获取到封面图片，则返回默认封面图片
	    return "";
	},
	async updateDraftsWithCover(){
		for (let draft of this.managementDrafts) {
			if(!draft.loadImg && draft.coverOption==='single'){
		    // 异步获取封面图片
		    let coverImageUrl = await this.handleDraftCover(draft.id);
		    // 将获取到的封面图片 URL 应用到 blog.pictureImg
		    draft.cover = coverImageUrl;
			draft.loadImg=true;
			}
		}
	},
	async getDraftsData(offset,count,userId){
		const data = {
			userId:userId,
			offset:offset,
		    count: count
		};
		try {
		    let  result = await request.sendUniPostRequestByNetWork(this.uid,this.token, "searchUserAllDrafts", data, "/draft/searchUserAllDrafts");
			//console.log("网络请求数据",result);
		    return result; // 返回结果
		} catch (error) {
		    console.error('Error fetching data:', error);
		    throw error; // 抛出错误以便调用者处理
		}
	},
	//草稿管理
	async fetchDraftsData(count,type){
		//草稿加载数据
		return new Promise((resolve) => {
			console.log("type",type,"offset",this.draftOffset);
			if(this.fetchDraftsOnce){
				this.fetchDraftsOnce=false;//开始重新查询
			}
			if(type==="refresh"){
				this.draftOffset=0;
			}
			this.getDraftsData(this.draftOffset,count,this.uid)
			    .then(result => {
				    try {
				     console.log("加载的数据",result);
				      if(result){
				     	if(result.code===1){
				     	   	const data=result.data;
				     		if(data){
								const newDrafts=[];
								data.forEach(draft => {
								    // 对每个博客对象进行处理  draft 
								   // console.log(blog.title);  // 假设博客对象有一个 title 字段
								   let typeStr='';
								   if(draft.articleType==="original"){
									   typeStr='原创';
								   }else if(draft.articleType==='reprint'){
									   typeStr='转载';
								   }else{
									    typeStr='翻译';
								   }
									   const newdraft={
										   id: draft.draftId,
										   userId:draft.userId,
											postId:draft.postId,
											title:draft.title,
											desc:draft.description,
											coverOption:draft.coverOption,
											cover:"",
											updateTime:draft.updatedAt,
											type:typeStr,
										   loadImg:false
									   }
									   
									   newDrafts.push(newdraft);
								});
								if(type==="refresh"){
									this.managementDrafts=newDrafts;
								}else{
									
									 // 如果不是刷新操作，将新的博客列表追加到已有的列表中
									    this.managementDrafts.push(...newDrafts); // 使用扩展运算符将 newBlogs 中的每个元素添加到 managementBlogs
								}
								this.draftOffset+=newDrafts.length;
								resolve(newDrafts);
								this.updateDraftsWithCover();
								return;
							}
				     		resolve([]);
				     		}else{
				     			if(result.error==='Unauthorized'){
				     				uni.showToast({
				     				    title: "还未登录", // 提示的内容
				     				    icon: 'error',   // 提示的图标，'error' 表示错误图标
				     				    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
				     				});
				     				// 设置 2 秒后跳转到登录页面
				     				setTimeout(() => {
				     				    uni.navigateTo({
				     				        url: "/pages/login/login"  // 跳转的页面路径
				     				    });
				     				}, 1000); // 设置延迟 2 秒后跳转
									 resolve([]);
				     				return;
				     				}
								  uni.showToast({
								      title: "获取草稿数据失败", // 提示的内容
								      icon: 'error',   // 提示的图标，'error' 表示错误图标
								      duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
								  });
				     			 resolve([]);
				     		}
				     	}else{
				     		
				     			uni.showToast({
				     			    title: "请求异常", // 提示的内容
				     			    icon: 'error',   // 提示的图标，'error' 表示错误图标
				     			    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
				     			});
				     			resolve([]);
				     			return;
				     	}
				    resolve([]);
				    return;
				    } catch (error) {
				    	console.error("草稿请求失败:", error);
				    	uni.showToast({
				    	     title: error,
				    	     icon: 'error',
				    		 duration:1000
				    	});
				    	resolve([]);
				    }
			})
			.catch(error => {
				resolve([]);
			    console.error('Error fetching data:', error);
			});
		});	
	},
	async delectedDraft(){
		this.isShowDeleteDraftModal=false;
		uni.showModal({
			title:"删除草稿",
			content:"确定要删除草稿吗？",
			cancelText:"算了",
			confirmText:"我要删除",
			success: (res) => {
				if(res.confirm){
					let userId=this.userId;
					if(!userId){
						userId=-1;
					}
					const data = {
						userId:this.uid,
						draftId:this.selectedDraft.id
					};
					request.sendUniPostRequestByNetWork(this.uid,this.token, "deleteDraft", data, "/draft/deleteDraft")
					.then(result => {
						try{
							if(result){
							  	if(result.code===1){	
							  		 uni.showToast({
							  			title: "删除成功", // 提示的内容
							  			icon: 'success',   // 提示的图标，'error' 表示错误图标
							  			duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  		});
									//根据id移除
									const  idToRemove=this.selectedDraft.id;
									this.managementDrafts =this.managementDrafts.filter(blog => blog.id !== idToRemove);
							  		return;
							  	}else{
							  		if(result.error==='Unauthorized'){
							  			uni.showToast({
							  			    title: "还未登录", // 提示的内容
							  			    icon: 'error',   // 提示的图标，'error' 表示错误图标
							  			    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  			});
							  			// 设置 2 秒后跳转到登录页面
							  			setTimeout(() => {
							  			    uni.navigateTo({
							  			        url: "/pages/login/login"  // 跳转的页面路径
							  			    });
							  			}, 1000); // 设置延迟 2 秒后跳转
							  			return;
							  			}
							  		  uni.showToast({
							  		      title: "删除失败", // 提示的内容
							  		      icon: 'error',   // 提示的图标，'error' 表示错误图标
							  		      duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  		  });
									
							  		return;
							  	  }
							}
							  	uni.showToast({
							  	    title: "删除失败", // 提示的内容
							  	    icon: 'error',   // 提示的图标，'error' 表示错误图标
							  	    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  	});
							  	return;
							  } catch (error) {
							      console.error('Error fetching data:', error);
							     uni.showToast({
							          title: error,
							          icon: 'error',
							     	 duration:1000
							     });
							  } 
					})
			       .catch(error => {
					   uni.showToast({
					        title: error,
					        icon: 'error',
					   	 duration:1000
					   });
			         console.error('Error fetching data:', error);
			    });	
				this.isShowDeleteDraftModal=false;
				}else{
					this.isShowDeleteDraftModal=true;
					return;
				}
			}
		})
	},
	goWriteDraft(item){
		console.log(item);
		let resourceId=item.postId;
		if(!item.postId){
			resourceId=-1;
		}
		//重新编辑草稿
		uni.navigateTo({
		   url:`/pages/writeBlogPost/writeBlogPost?draftId=${item.id}&resourceId=${resourceId}`
		});
	},
	editBlog(){
		console.log(this.selectedBlog);
		const item=this.selectedBlog;
		let resourceId=item.id;
		if(!resourceId){
			resourceId=-1;
		}
		
		//重新编辑草稿
		uni.navigateTo({
		   url:`/pages/writeBlogPost/writeBlogPost?resourceId=${resourceId}`
		});
	},
	selectDraft(item){
		//选中草稿
		this.isShowDeleteDraftModal=true;
		this.selectedDraft=item;
	},
	//博客管理
	async delectedBlog(){
		this.isShowDeleteBlogModal=false;
		uni.showModal({
			title:"删除博客",
			content:"确定要删除博客吗？",
			cancelText:"算了",
			confirmText:"我要删除",
			success: (res) => {
				if(res.confirm){
					let userId=this.userId;
					if(!userId){
						userId=-1;
					}
					const data = {
						userId:this.uid,
						postId:this.selectedBlog.id
					};
					request.sendUniPostRequestByNetWork(this.uid,this.token, "deleteBlog", data, "/post/deleteBlog")
					.then(result => {
						try{
							if(result){
							  	if(result.code===1){	
							  		 uni.showToast({
							  			title: "删除成功", // 提示的内容
							  			icon: 'success',   // 提示的图标，'error' 表示错误图标
							  			duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  		});
									//根据id移除
									const  idToRemove=this.selectedBlog.id;
									this.managementBlogs =this. managementBlogs.filter(blog => blog.id !== idToRemove);
							  		return;
							  	}else{
							  		if(result.error==='Unauthorized'){
							  			uni.showToast({
							  			    title: "还未登录", // 提示的内容
							  			    icon: 'error',   // 提示的图标，'error' 表示错误图标
							  			    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  			});
							  			// 设置 2 秒后跳转到登录页面
							  			setTimeout(() => {
							  			    uni.navigateTo({
							  			        url: "/pages/login/login"  // 跳转的页面路径
							  			    });
							  			}, 1000); // 设置延迟 2 秒后跳转
							  			
							  			return;
							  			}
							  		  uni.showToast({
							  		      title: "删除失败", // 提示的内容
							  		      icon: 'error',   // 提示的图标，'error' 表示错误图标
							  		      duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  		  });
							  		return;
							  	  }
							}
							  	uni.showToast({
							  	    title: "删除失败", // 提示的内容
							  	    icon: 'error',   // 提示的图标，'error' 表示错误图标
							  	    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
							  	});
							  	return;
							  } catch (error) {
							      console.error('Error fetching data:', error);
							     uni.showToast({
							          title: error,
							          icon: 'error',
							     	 duration:1000
							     });
							  } 
					})
			       .catch(error => {
					   uni.showToast({
					        title: error,
					        icon: 'error',
					   	 duration:1000
					   });
			         console.error('Error fetching data:', error);
			    });	
				this.isShowDeleteBlogModal=false;
				}else{
					this.isShowDeleteBlogModal=true;
					return;
				}
			}
		})
	},
	async handleBlogPictureCover(blogId) {
	    if (blogId) {
	        // 根据 blogId 构造封面图片的 URL
	        let url = this.baseUrl + "/file/" + blogId + "?type=cover";
	        
	        try {
	            // 发送请求获取封面图片
	            let result = await request.sendUniGetRequestByNetWork(blogId, undefined, url);
	
	            if (result && result.code === 1 && result.data) {
	                let coverImageResult = result.data;
	                if (coverImageResult && coverImageResult.imgType && coverImageResult.fileContent) {
	                    // 成功获取封面图片，生成图片 URL
	                    return file.generateImagUrl(coverImageResult.fileContent, coverImageResult.imgType);
	                }
	            }
	        } catch (error) {
	            console.error("获取封面图片失败", error);
	        }
	    }
	
	    // 如果没有获取到封面图片，则返回默认封面图片
	    return "";
	},
	async updateRelatedBlogsWithCover() {
	    for (let blog of this.managementBlogs) {
			if(!blog.loadImg){
	        // 异步获取封面图片
	        let coverImageUrl = await this.handleBlogPictureCover(blog.id);
	        // 将获取到的封面图片 URL 应用到 blog.pictureImg
	        blog.pictureImg = coverImageUrl;
			blog.loadImg=true;
			}
	    }
	
	    // 调试输出，确认封面图片已更新
	   // console.log("相关博客列表:", this.relatedBlogs);
	},
	async getManagementBlogs(offset,count,userId) {
	    const data = {
			userId:userId,
			offset:offset,
	        count: count
	    };
	    try {
	        let  result = await request.sendUniPostRequestByNetWork(this.uid,this.token, "searchUserAllBlogs", data, "/post/searchUserAllBlogs");
			//console.log("网络请求数据",result);
	        return result; // 返回结果
	    } catch (error) {
	        console.error('Error fetching data:', error);
	        throw error; // 抛出错误以便调用者处理
	    }
	},
	async fetchManagementBlogs(count,type){
		return new Promise((resolve) => {
			console.log("type",type,"offset",this.managementBlogsOffset);
			if(this.fetchManagementBlogsOnce){
				this.fetchManagementBlogsOnce=false;//开始重新查询
			}
			if(type==="refresh"){
				this.managementBlogsOffset=0;
			}
			this.getManagementBlogs(this.managementBlogsOffset,count,this.uid)
			    .then(result => {
				    try {
				     console.log("加载的数据",result);
				      if(result){
				     	if(result.code===1){
				     	   	const data=result.data;
				     		if(data){
								const newBlogs=[];
								data.forEach(blog => {
								    // 对每个博客对象进行处理
								   // console.log(blog.title);  // 假设博客对象有一个 title 字段
									   const newblog={
										   id: blog.id,
										  // username: blog.authorName,
										   postTitle: blog.title,
										   postIntroduce: blog.blogDescribe,
										   pictureImg: "/static/img/default_cover.jpeg",
										   viewCount: blog.readCount,
										   likeCount: blog.likesCount,
										   collectCount: blog.favoriteCount,
										   commentCount: blog.commentsCount,
										   loadImg:false
									   }
									   
									   newBlogs.push(newblog);
								});
								if(type==="refresh"){
									this.managementBlogs=newBlogs;
								}else{
									
									 // 如果不是刷新操作，将新的博客列表追加到已有的列表中
									    this.managementBlogs.push(...newBlogs); // 使用扩展运算符将 newBlogs 中的每个元素添加到 managementBlogs
								}
								this.managementBlogsOffset+=newBlogs.length;
								resolve(newBlogs);
							    this.updateRelatedBlogsWithCover();
								return;
							}
				     		resolve([]);
				     		}else{
				     			if(result.error==='Unauthorized'){
				     				uni.showToast({
				     				    title: "还未登录", // 提示的内容
				     				    icon: 'error',   // 提示的图标，'error' 表示错误图标
				     				    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
				     				});
				     				// 设置 2 秒后跳转到登录页面
				     				setTimeout(() => {
				     				    uni.navigateTo({
				     				        url: "/pages/login/login"  // 跳转的页面路径
				     				    });
				     				}, 1000); // 设置延迟 2 秒后跳转
									 resolve([]);
				     				return;
				     				}
								  uni.showToast({
								      title: "接受的数据异常", // 提示的内容
								      icon: 'error',   // 提示的图标，'error' 表示错误图标
								      duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
								  });
				     			 resolve([]);
				     		}
				     	}else{
				     		
				     			uni.showToast({
				     			    title: "请求异常", // 提示的内容
				     			    icon: 'error',   // 提示的图标，'error' 表示错误图标
				     			    duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
				     			});
				     			resolve([]);
				     			return;
				     	}
				    resolve([]);
				    return;
				    } catch (error) {
				    	console.error("博客请求失败:", error);
				    	uni.showToast({
				    	     title: error,
				    	     icon: 'error',
				    		 duration:1000
				    	});
				    	resolve([]);
				    }
			})
			.catch(error => {
				resolve([]);
			    console.error('Error fetching data:', error);
			});
	    });	
	},
	calculateViewHeight() {
	    this.$nextTick(() => {
	        const query = uni.createSelectorQuery().in(this);
	        // 获取 index-header-xhd 的高度
	        query.select('.content').boundingClientRect(headerData => {
	            this.viewHeight =headerData ? headerData.height : 0 ;
	            console.log('可用高度:', this.viewHeight);
	        }).exec();
	    });
	},
    goDisplyBlog(item){
		uni.navigateTo({
			 url: `/pages/blogArticleDisplay/blogArticleDisplay?id=${item.id}`
		})
	},
    selectBlog(item){
    	console.log("选择的item",item);
    	this.selectedBlog=item;
    	this.isShowDeleteBlogModal=true;
    },
	cancel(){
		this.isShowDeleteBlogModal=false;
	},
    goToLiveDisplay(uid, postId) {
        uni.navigateTo({
          url: "/pages/liveDisplay/liveDisplay?uid=" + uid + "&postId=" + postId,
        });
      },
    initData() {
        this.uid = uni.getStorageSync("UID");
        this.token = uni.getStorageSync("token");
		if(this.uid&&this.token){
			return;
		}
		// uni.showToast({
		//     title: "还未登录", // 提示的内容
		//     icon: 'error',   // 提示的图标，'error' 表示错误图标
		//     duration: 1000   // 持续时间，单位是毫秒，2000 毫秒即 2 秒
		// });
		// // 设置 2 秒后跳转到登录页面
		// setTimeout(() => {
		//     uni.redirectTo({
		//         url: "/pages/login/login"  // 跳转的页面路径
		//     });
		// }, 1000); // 设置延迟 2 秒后跳转
      },
      getIndex(value) {
			this.currentIndex = value;
      },
    getMyLive() {
        method
          .getMyLive(this.liveCurrentPage, this.livePageSize, this.uid, this.token)
          .then((result) => {
            result.data.forEach((data) => {
              const imgs = data.base64Images.map((image) => {
                const dataUrl = `data:image/${image.extension};base64,${image.base64}`;
                return dataUrl;
              });
              this.liveList.unshift({
                postId: data.post.postId,
                content: data.post.content,
                likesCount: data.post.likesCount,
                createdAt: data.post.createdAt,
                imgs,
              });
			  this.isLiveReady=true
            });
			 this.isLiveReady=true
			 // console.log("加载成功",this.isLiveReady)
          })
          .catch((error) => {
			  this.isLiveReady=true
			  // console.log("失败")
			  console.log(error.message)
		  });
      },
      formatTime(time) {
        const date = new Date(time);
        const year = date.getFullYear();
        const month = String(date.getMonth() + 1).padStart(2, "0");
        const day = String(date.getDate()).padStart(2, "0");
        const hours = String(date.getHours()).padStart(2, "0");
        const minutes = String(date.getMinutes()).padStart(2, "0");
        return `${year}-${month}-${day} ${hours}:${minutes}`;
      },
      deletePost(index, postId) {
        uni.showModal({
        	title:"注意",
			content:"你确定要删除吗",
			cancelText:"取消",
			confirmText:"删除",
			success: (res) => {
				if(res.confirm){
					method
					  .deleteMyLive(postId, this.uid, this.token)
					  .then(() => {
					    this.liveList.splice(index, 1);  // 删除对应的动态
					    console.log("删除成功");
						uni.showToast({
						  title: "删除成功",
						  icon: "success"
						});
					  })
					  .catch((error) => {
					    console.log("删除失败", error.message);
					    uni.showToast({
					      title: "删除失败",
					      icon: "none",
					    });
					  });
				}else{
					uni.showToast({
					  title: "已取消",
					  icon: "none",
					  duration:500
					});
				}
			}
        })
      },
    },
 
  };
</script>
  <style lang="scss">
	.whole{
		height: 100%; /* 使整个容器充满屏幕高度 */
		display: flex;
		flex-direction: column; /* 垂直排列 */
		
		
		.delete-blog-modal{
			padding: 30rpx;
			box-sizing: border-box;
		  	position: fixed;
		  	bottom: 0;
		  	left: 0;
		  	right: 0;
		  	width: 100%;
		  	height: 100%;
			background-color: rgba(0, 0, 0, 0.5);
		  	display: flex;
		  	justify-content: center;
			align-items: center;
		  //	align-items: flex-end; /* 从底部对齐 */
		  	z-index: 10001; /* 确保模态框位于最上层 */
		  	/* 初始状态为隐藏 */
		  	transform: translateY(100%);
		  	opacity: 0;
		  	transition:  opacity 0.5s ease; /* 添加过渡效果 */
		  	//background-color: red;
		  	.delete-blog-modal-content{
		  		  background-color: white;
		  		//background-color:;
		  		 padding: 20rpx;
		  		 border-radius: 30rpx;
		  		 width: 100%;
		  		// height: 500rpx; /* 最大高度 */
		  		 box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
		  		 display: flex;
		  		 flex-direction: column; /* 纵向布局 */
		  		 position: relative;
				 .modal-item {
				   display: flex;
				   align-items: center;
				   padding: 12px;
				   border-bottom: 1px solid #ddd;
				   .icon {
				     color: #000;
				     font-size: 30rpx;
				     width: 40rpx;
				     height: 40rpx;
				     text-align: center;
				     line-height: 40rpx;
				     margin-right: 12px;
				   }
				   
				   .text {
				     font-size: 16px;
				     color: #333;
				   }
				 }
				 
				 .modal-item:last-child {
				   border-bottom: none; /* 去掉最后一行的边框 */
				 }
				 
				
			}
		}
		
		
		
		.delete-draft-modal{
			padding: 30rpx;
			box-sizing: border-box;
		  	position: fixed;
		  	bottom: 0;
		  	left: 0;
		  	right: 0;
		  	width: 100%;
		  	height: 100%;
			background-color: rgba(0, 0, 0, 0.5);
		  	display: flex;
		  	justify-content: center;
			align-items: center;
		  //	align-items: flex-end; /* 从底部对齐 */
		  	z-index: 10001; /* 确保模态框位于最上层 */
		  	/* 初始状态为隐藏 */
		  	transform: translateY(100%);
		  	opacity: 0;
		  	transition:  opacity 0.5s ease; /* 添加过渡效果 */
		  	//background-color: red;
		  	.delete-draft-modal-content{
		  		  background-color: white;
		  		//background-color:;
		  		 padding: 20rpx;
		  		 border-radius: 30rpx;
		  		 width: 100%;
		  		// height: 500rpx; /* 最大高度 */
		  		 box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
		  		 display: flex;
		  		 flex-direction: column; /* 纵向布局 */
		  		 position: relative;
				 .modal-item {
				   display: flex;
				   align-items: center;
				   padding: 12px;
				   border-bottom: 1px solid #ddd;
				   .icon {
				     color: #000;
				     font-size: 30rpx;
				     width: 40rpx;
				     height: 40rpx;
				     text-align: center;
				     line-height: 40rpx;
				     margin-right: 12px;
				   }
				   
				   .text {
				     font-size: 16px;
				     color: #333;
				   }
				 }
				 
				 .modal-item:last-child {
				   border-bottom: none; /* 去掉最后一行的边框 */
				 }
				 
				
			}
		}
		/* 滑入效果 */
		 .delete-draft-modal.slide-in {
		   transform: translateY(0); /* 滑入 */
		   opacity: 1; /* 完全可见 */
		 }
		 
		 /* 滑出效果 */
		 .delete-draft-modal.slide-out {
		   transform: translateY(100%); /* 滑出 */
		   opacity: 0; /* 完全透明 */
		 }
		 /* 滑入效果 */
		  .delete-blog-modal.slide-in {
		    transform: translateY(0); /* 滑入 */
		    opacity: 1; /* 完全可见 */
		  }
		  
		  /* 滑出效果 */
		  .delete-blog-modal.slide-out {
		    transform: translateY(100%); /* 滑出 */
		    opacity: 0; /* 完全透明 */
		  }
		
		.content{
			flex: 1;
			//background-color:  red;
			padding: 20rpx;
			box-sizing: border-box;
			.draftShow{
				//background-color: red;
				  display: flex;
				  flex-direction: column; /* 垂直排列 */
				  border-bottom: 1rpx solid rgba(0, 0, 0, 0.2); /* 透明底部边框 */
				    .draftText {
				      display: flex;
				      align-items: center;
				      padding: 10rpx;
				      margin-bottom: 10rpx;
					  .text {
					     flex: 1;
					     margin-left: 10rpx;	
					     &.fullWidth {
					         flex: 0 0 90%; /* 当没有图片时占据 90% 的宽度 */
					     }
					  			
					        .draftTitle {
							 font-weight: bold;
					          font-size: 1.1rem;
					          display: -webkit-box; /* 使用 Flexbox */
					          -webkit-box-orient: vertical; /* 垂直排列 */
					          -webkit-line-clamp: 2; /* 限制为两行显示 */
					          overflow: hidden;
					          text-overflow: ellipsis; /* 超出部分显示省略号 */
					        }
					  			
					        .draftIntroduce {
					          font-size: 24rpx;
					          color: #666;
					          display: -webkit-box;
					          -webkit-box-orient: vertical;
					          -webkit-line-clamp: 2;
					          overflow: hidden;
					          text-overflow: ellipsis;
					        }
					      }
						.picture {
						  width: 20%;
						  height: 80rpx;
						  background-repeat: no-repeat;
						  background-size: cover;
						  background-position: center;
						}
						    
					}//博客text
					
					
					.otherDraftMsg{
						display: flex;
						justify-content: space-between;
						align-items: center;
						  margin-bottom: 20rpx;
						.icon {
						 color: #000;
						 font-size: 30rpx;
						 width: 40rpx;
						 height: 40rpx;
						 text-align: center;
						 line-height: 40rpx;
						 margin-right: 12px;
						}
						.draftMsg {
						  font-size: 20rpx;
						  display: flex;
						  align-items: center;
						  margin-left: 20rpx;
						  .text,	
						  .type,
						  .lastUpdateTime {
						    margin-right: 20rpx;
						  }
						  .type{
							  color: green;
						  }
						}
					}				
				}//草稿展示	
			.blogShow{
			//background-color: red;
			  display: flex;
			  flex-direction: column; /* 垂直排列 */
			  border-bottom: 1rpx solid rgba(0, 0, 0, 0.2); /* 透明底部边框 */
			    .blogText {
			      display: flex;
			      align-items: center;
			      padding: 10rpx;
			      margin-bottom: 10rpx;
				  .text {
				     flex: 1;
				     margin-left: 10rpx;	
				     &.fullWidth {
				         flex: 0 0 90%; /* 当没有图片时占据 90% 的宽度 */
				     }
				  			
				        .blogTitle {
						 font-weight: bold;
				          font-size: 1.1rem;
				          display: -webkit-box; /* 使用 Flexbox */
				          -webkit-box-orient: vertical; /* 垂直排列 */
				          -webkit-line-clamp: 2; /* 限制为两行显示 */
				          overflow: hidden;
				          text-overflow: ellipsis; /* 超出部分显示省略号 */
				        }
				  			
				        .blogIntroduce {
				          font-size: 24rpx;
				          color: #666;
				          display: -webkit-box;
				          -webkit-box-orient: vertical;
				          -webkit-line-clamp: 2;
				          overflow: hidden;
				          text-overflow: ellipsis;
				        }
				      }
					.picture {
					  width: 20%;
					  height: 80rpx;
					  background-repeat: no-repeat;
					  background-size: cover;
					  background-position: center;
					}
					    
				}//博客text
				
				
				.otherBlogMsg{
					display: flex;
					justify-content: space-between;
					align-items: center;
					  margin-bottom: 20rpx;
					.icon {
					 color: #000;
					 font-size: 30rpx;
					 width: 40rpx;
					 height: 40rpx;
					 text-align: center;
					 line-height: 40rpx;
					 margin-right: 12px;
					}
					.blogMsg {
					  font-size: 20rpx;
					  display: flex;
					  align-items: center;
					  margin-left: 20rpx;
					  .collectCount,	
					  .username,
					  .read,
					  .commentCount {
					    margin-right: 20rpx;
					  }
					}
				}				
			}//博客展示
		}
	}
	
    .dynamic-container {
      padding: 10rpx;
    }
  
    /* 单个动态项 */
.dynamic-item {
    display: flex; /* 添加 flex 布局 */
    flex-direction: row; /* 横向排列，图片和内容左右展示 */
	margin: 10rpx 0;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    background-color: #fff;
    align-items: flex-start; /* 确保图片和内容顶部对齐 */
    height: 180rpx; /* 保证父容器有足够高度 */
}

/* 删除按钮样式 */
.delete-btn {
    background-color: red;
    color: white;
    border-radius: 5px;
    padding: 5rpx 10rpx; /* 按钮内边距 */
    text-align: center;
    margin-right: 15rpx; /* 按钮之间的间距 */
}

/* 左侧图片 */
.dynamic-images {
    display: flex; /* 使用 flex 布局 */
    justify-content: center; /* 图片在容器内水平居中 */
    align-items: center; /* 图片在容器内垂直居中 */
    margin-right: 10rpx; /* 调整图片与文字之间的间距 */
}

/* 单张图片样式 */
.dynamic-image {
    width: 80px;
    height: 80px;
    border-radius: 5px;
    object-fit: cover; /* 保证图片不变形 */
    margin-right: 10rpx; /* 调整图片间距 */
}

/* 右侧内容区域 */
.dynamic-content {
    flex: 1; /* 内容区域占满剩余空间 */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* 保证内容均匀分布 */
    height: 100%; /* 确保内容区域填满父容器 */
}

/* 内容文本 */
.dynamic-text {
    font-size: 14px;
    color: #333;
    margin-bottom: 8rpx;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1; /* 限制为一行 */
    overflow: hidden;
    text-overflow: ellipsis; /* 超出部分显示省略号 */
    width: 100%; /* 限制宽度 */
}

/* 点赞数和按钮容器 */
.likes-buttons-container {
    display: flex; /* 使用 flex 布局 */
    align-items: center; /* 垂直居中对齐 */
    justify-content: space-between; /* 两端对齐 */
}

/* 点赞数 */
.likes {
    font-size: 12px;
    margin-right: 10rpx; /* 点赞数与按钮之间的间距 */
    flex-shrink: 0; /* 防止点赞数被挤压 */
}

/* 发布时间 */
.time {
    font-size: 12px;
    color: #888;
    flex-shrink: 0; /* 防止发布时间被挤压 */
}

  
  
  
    /* 确保滑动容器能够显示 */
    .swipe-action-item {
      width: 100%; /* 确保每个项目占满整个宽度 */
    }
	.null{
		margin-top: 10rpx;
		color: lightgray;
		font-size: 32rpx;
		text-align: center;
	}
	.loadingLive{
		color: lightgray;
		height: 50px;
		width: 50px;
		margin-top: 300rpx;
		margin-left: 300rpx;
	}

</style>
